<!DOCTYPE html>
<html lang="en">
	<head>
		<meta charset="utf-8">
		<title>注册</title>
		[#include "/common/include.ftl"/]
		<link type="text/css" rel="styleSheet" href="${base}/resource/css/register.css">
		<script type="text/javascript" src="${base}/resource/js/jquery.validate.js"></script>
		<script type="text/javascript" src="${base}/resource/js/password.js"></script>
		<script type="text/javascript" src="${base}/resource/js/encrypt.js"></script>
		<script type="text/javascript" src="${base}/resource/js/validate.js"></script>
		<script type="text/javascript">
			var last = 180;
			var timer;
			var flag = false;
			$(function() {
				jQuery.validator.addMethod("passwordFM", function(value, element) {
					return this.optional(element) || checkPassword(value).success;
				}, '密码长度为6-20，由英文、数字及符号中两种组成');
				var $validateForm = $("#registerForm");
				$validateForm.validate({
					errorElement : 'span',
					errorClass : 'validError',
					rules : {
						"mobile" : {
							required : true,
							mobile : true
						},
						"password" : {
							required : true,
							passwordFM : true
						},
						"repassword" : {
							equalTo : "#password"
						},
						"captcha" : {
							required : true
						},
						"code" : {
							required : true
						}
					},
					messages : {
						"mobile" : {
							required : "手机号码不能为空"
						},
						"password" : {
							required : "密码不能为空"
						},
						"repassword" : {
							equalTo : "两次输入的密码不一致"
						},
						"captcha" : {
							required : "验证码不能为空"
						},
						"code" : {
							required : "手机验证码不能为空"
						}
					},
					errorPlacement : function(error, element) {
						error.appendTo(element.parent().find('.err-msg'));
					}
				});

				$("#captchaImg").click(function() {
					$("#captchaImg").attr("src", "${base}/captcha.jhtml?captchaId=${captchaId}&timestamp=" + (new Date()).valueOf());
				});
			});

			/*function checkCaptcha() {
				var value = $("#captcha").val();
				if (value != '') {
					ajax({
						url : base + "/checkCaptcha.jhtml",
						data : {
							captchaId : "${captchaId}",
							captcha : value
						},
						success : function(data) {
							if (data.result) {
								$("#mobileCode").show();
								$("#captchaCode").hide();
							} else {
								oDialog.prompt("验证码错误");
								$("#captchaImg").attr("src", "${base}/captcha.jhtml?captchaId=${captchaId}&timestamp=" + (new Date()).valueOf());
							}
						}
					});
				} else {
					oDialog.prompt("请输入验证码");
				}
			}*/

			function sendSms(obj) {
				$this = $(obj);
				var mobile = $("#mobile").val();
				if (mobile != '') {
					if (flag) {
						return;
					}
					ajax({
						url : base + "/sendRegisterSms.jhtml",
						data : {
							captchaId : "${captchaId}",
							mobile : mobile
						},
						showError : true,
						success : function(data) {
							if (data.type == "success") {
								oDialog.prompt("验证码发送成功");
								flag = true;
								timer = setInterval(function() {
									last--;
									if (last > 0) {
										$this.html(last + "秒后可重发");
									} else {
										flag = false;
										$this.html("发送验证码");
										clearInterval(timer);
									}
								}, 1000);
							} else {
								oDialog.prompt(data.content);
							}
						}
					});
				} else {
					oDialog.prompt("请输入手机号码");
				}
			}

			function register() {
				if ($("#registerForm").valid()) {
					var password = $("#password").val();
					ajax({
						url : base + "/publicKey.jhtml",
						type : "GET",
						cache : false,
						showError : true,
						loading : '正在登录...',
						success : function(data) {
							var rsaKey = new RSAKey();
							rsaKey.setPublic(b64tohex(data.modulus), b64tohex(data.exponent));
							password = hex2b64(rsaKey.encrypt(password));
							ajax({
								url : base + "/registerVerify.jhtml",
								data : {
									captchaId : "${captchaId}",
									mobile : $("#mobile").val(),
									email : $("#email").val(),
									password : password,
									captcha:$("#captcha").val(),
									code : $("#code").val()
								},
								showError:true,
								success : function(data) {
									if (data.type == "success") {
										window.location = base + "/index.jhtml";
									}
								},
								error: function (xhr,status) {
									$("#captchaImg").trigger('click');
                                }
							});
						}
					});
				}
			}
		</script>
	</head>
	<body class="customer">
		<div class="top w1">
			[#include "common/header-top.ftl"]
			<div class="top-search w">
				<div id="header-logo" class="text-log">
					<div class="t-log">
						<a href="${base}/index.jhtml">
							<img src="[@Pic pic=setting.logo/]">
						</a>
					</div>
					<div class="t-text">
						欢迎注册
					</div>
				</div>
			</div>
		</div>
		<div id="P_register">
			<div class="register-wrap">
				<form id="registerForm">
					<div id="form-groups-list" class="register-from">
						<h2 class="title">注册新用户</h2>
						<dl class="item">
							<dt>
								&nbsp;
							</dt>
							<dd>
								<input type="text" name="mobile" id="mobile" placeholder="手机" class="name placeholder">
								<span class="err-msg"></span>
							</dd>
						</dl>
						<dl class="item">
							<dt>
								&nbsp;
							</dt>
							<dd>
								<input type="password" name="password" id="password" placeholder="密码" class="pwd placeholder">
								<span class="err-msg"></span>
							</dd>
						</dl>
						<dl class="item">
							<dt>
								&nbsp;
							</dt>
							<dd>
								<input type="password" name="repassword" placeholder="确认密码" class="ag-pwd placeholder">
								<span class="err-msg"></span>
							</dd>
						</dl>
						<dl class="item captcha-wrap" id="captchaCode">
							<dt>
								&nbsp;
							</dt>
							<dd>
								<input type="text" name="captcha" id="captcha" placeholder="验证码" class="captcha placeholder">
								<img src="${base}/captcha.jhtml?captchaId=${captchaId}" id="captchaImg">
								[#--<a class="hp-btn-captcha" href="javascript:checkCaptcha();">确认验证码</a>--]
								<span class="err-msg"></span>
							</dd>
						</dl>
						<dl class="item captcha-wrap" [#--style="display: none;"--] id="mobileCode">
							<dt>
								&nbsp;
							</dt>
							<dd>
								<input type="text" class="captcha placeholder" name="code" id="code" placeholder="手机验证码">
								<a class="hp-btn-captcha" onclick="sendSms(this);">发送验证码</a>
								<span class="err-msg"></span>
							</dd>
						</dl>

						<dl class="item agreement">
							<dt></dt>
							<dd>
								<input type="checkbox" checked="checked">
								<span>我已阅读并同意<a>(用户协议)</a></span>
							</dd>
						</dl>
						<dl class="item">
							<dt></dt>
							<dd>
								<a class="hp-btn-register" href="javascript:register();">注册</a>
							</dd>
						</dl>
					</div>
					<div class="h-lg-wrap">
						<h2>已经有360跨界商萌账号?</h2><a href="${base}/login.jhtml" class="hp-button go-login">账号登陆</a>
					</div>
				</form>
			</div>
		</div>

		[#include "common/footer-simple.ftl"]
	</body>
</html>